<style lang="less">
    @import "./home.less";
    @import "../../styles/common.less";
</style>
<template>
    <div class="home-main">
        <Row :gutter="10">
            <Col :md="24" :lg="24">
                <Row :gutter="5">
                    <Col :xs="24" :sm="12" :md="6" :style="{marginBottom: '10px'}">
                        <infor-card
                            id-name="user_created_count"
                            :end-val="count.examineeNum"
                            iconType="person-stalker"
                            color="#2d8cf0"
                            intro-text="用户总数"
                        ></infor-card>
                    </Col>
                    <Col :xs="24" :sm="12" :md="6" :style="{marginBottom: '10px'}">
                        <infor-card
                            id-name="visit_count"
                            :end-val="count.todayExamineeNum"
                            iconType="edit"
                            color="#64d572"
                            :iconSize="50"
                            intro-text="今日考生人数"
                        ></infor-card>
                    </Col>
                    <Col :xs="24" :sm="12" :md="6" :style="{marginBottom: '10px'}">
                        <infor-card
                            id-name="collection_count"
                            :end-val="count.testPersonnelNum"
                            iconType="ios-body"
                            color="#ffd572"
                            intro-text="总共考试人次"
                        ></infor-card>
                    </Col>
                    <Col :xs="24" :sm="12" :md="6" :style="{marginBottom: '10px'}">
                        <infor-card
                            id-name="transfer_count"
                            :end-val="count.subjectNum"
                            iconType="ios-bookmarks"
                            color="#f25e43"
                            intro-text="题库总量"
                        ></infor-card>
                    </Col>
                </Row>
            </Col>
        </Row>
        <Row :gutter="10" class="margin-top-10">
            <Col :md="24" :lg="8" :style="{marginBottom: '10px'}">
                <Card>
                    <p slot="title" class="card-title">
                        <Icon type="android-map"></Icon>
                        考生年龄分布
                    </p>
                    <div class="data-source-row">
                        <visite-volume></visite-volume>
                    </div>
                </Card>
            </Col>
            <Col :md="24" :lg="8" :style="{marginBottom: '10px'}">
                <Card>
                    <p slot="title" class="card-title">
                        <Icon type="ios-pulse-strong"></Icon>
                        题目统计
                    </p>
                    <div class="data-source-row">
                        <data-source-pie></data-source-pie>
                    </div>
                </Card>
            </Col>
        </Row>
    </div>
</template>

<script>
import cityData from './map-data/get-city-value.js';
import homeMap from './components/map.vue';
import dataSourcePie from './components/dataSourcePie.vue';
import visiteVolume from './components/visiteVolume.vue';
import serviceRequests from './components/serviceRequests.vue';
import countUp from './components/countUp.vue';
import inforCard from './components/inforCard.vue';
import mapDataTable from './components/mapDataTable.vue';

export default {
    name: 'home',
    components: {
        homeMap,
        dataSourcePie,
        visiteVolume,
        serviceRequests,
        countUp,
        inforCard,
        mapDataTable
    },
    data () {
        return {
            count: {
                examineeNum: 0,
                todayExamineeNum: 0,
                testPersonnelNum: 0,
                subjectNum: 0
            },
            cityData: cityData,
            showAddNewTodo: false,
            newToDoItemValue: ''
        };
    },
    mounted:function() {
        let that=this;
        this.axios({
            method: 'get',
            url: that.$store.state.app.globalUrl+'/admin/Examinee/getExamineeNum',
            data: {}
        }).then(function(res){
            that.count.examineeNum=res.data.data.examineeNum;
        })
        this.axios({
            method: 'get',
            url: that.$store.state.app.globalUrl+'/admin/Examinee/getTodayExamineeNum',
            data: {}
        }).then(function(res){
            that.count.todayExamineeNum=res.data.data.examineeNum;
        })
        this.axios({
            method: 'get',
            url: that.$store.state.app.globalUrl+'/admin/Examinee/getTestPersonnelNum',
            data: {}
        }).then(function(res){
            that.count.testPersonnelNum=res.data.data.examineeNum;
        })
        this.axios({
            method: 'get',
            url: that.$store.state.app.globalUrl+'/admin/Subject/getSubjectNum',
            data: {}
        }).then(function(res){
            that.count.subjectNum=res.data.data.subjectNum;
        })
    },
    computed: {
        avatorPath () {
            return localStorage.avatorImgPath;
        }
    },
    methods: {
        
    }
};
</script>
